import React, {Component} from 'react';
import {Link} from 'react-router';
import '../work/index.less';
import {connect}from 'react-redux';
import {Table,Icon,Popconfirm,Input,Radio,Button,Spin,Modal} from 'antd';
import {SetStatus,AddDatas}from '../../actions/welcome';

const RadioGroup = Radio.Group;
class Nlayer extends Component {
    constructor(props){
        super(props);
        this.state={
            ...this.props.welcome,
            confirmLoading: false,
            isSubmit:false,
            form:this.props.welcome.form,
        }
    }
     sinadd(key,data){ 
         console.log('222');
         console.log(data.target.value);
      this.setState({
          form:Object.assign({},this.state.form,{[key]:data.target.value})
      })
      //this.props.dispatch(AddDatas(this.state.form));
  }
  componentWillReceiveProps(nextProps){
    // if(nextProps.welcome.status == 1){
    //     let form=nextProps.welcome.form;
    //     this.setState({
    //           form:form,
    //     })
    //     this.props.dispatch(SetStatus());
    // }
    if(nextProps.showstate == 1 && !this.state.isSubmit){
        console.log(nextProps.edituser)
        var tmp = {
            sex:nextProps.edituser.UserGender,
            id:nextProps.edituser.UserId,
            username:nextProps.edituser.UserName,
            telephone:nextProps.edituser.UserTelPhone,
        }
        this.setState({
            form:tmp,
        });
    }
    
  }
  submitForm(){
      this.setState({
          isSubmit:true,
      },() => {
        this.props.handleOk(this.state.form,this.props.showstate)
      });
      setTimeout(() =>{
          this.setState({
              isSubmit:false
          })
      },2000);
  }
    render(){
         const { visible, confirmLoading } = this.state;
        
        return (
            <div className='layer'>   
                <Modal
                    title={this.props.showstate == 0?('新增'):('编辑')}
                    visible={this.props.visible}
                    confirmLoading={confirmLoading}
                    onOk={()=>this.submitForm()}
                    onCancel={()=>this.props.handleCancel()}>
                    用户ID : <Input placeholder='请输入内容' size="large" className='input' onChange={this.sinadd.bind(this,'id')} value={this.state.form.id}/><br/>
                    用户名 : <Input placeholder='请输入内容' size="large" className='input' onChange={this.sinadd.bind(this,'username')} value={this.state.form.username}/><br/>
                    手机号 : <Input placeholder='请输入内容' size="large" className='input' onChange={this.sinadd.bind(this,'telephone')} value={this.state.form.telephone}/><br/>
                    性  别 : <RadioGroup onChange={this.sinadd.bind(this,'sex')} value={this.state.form.sex}>
                        <Radio value={0}>男</Radio>
                        <Radio value={1}>女</Radio>
                    </RadioGroup>  
                </Modal>
            </div> 
        )
    }
}
const mapStateToProps=(state)=>{
    return {
        welcome:state.welcome,
    }
}
export default connect(mapStateToProps)(Nlayer);